<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="generator" content="Jekyll v3.6.0">
<title>文本处理 &middot; Bootstrap</title>
<!-- Bootstrap 核心CSS -->
<link href="../dist/css/bootstrap.min.css" rel="stylesheet">
<!-- 本文档额外专用css -->
<link href="../assets/css/docsearch.min.css" rel="stylesheet">
<link href="../assets/css/docs.min.css" rel="stylesheet">

<!-- Favicons图标定义 -->
<link rel="apple-touch-icon" href="../assets/img/favicons/apple-touch-icon.png" sizes="180x180">
<link rel="icon" href="../assets/img/favicons/favicon-32x32.png" sizes="32x32" type="image/png">
<link rel="icon" href="../assets/img/favicons/favicon-16x16.png" sizes="16x16" type="image/png">
  
<link rel="mask-icon" href="../assets/img/favicons/safari-pinned-tab.svg" color="#563d7c">
<link rel="icon" href="../favicon.ico">
<meta name="msapplication-config" content="../assets/img/favicons/browserconfig.xml">
<meta name="theme-color" content="#563d7c">

<!-- Meta关键字定义 -->
<meta name="description" content="The most popular HTML, CSS, and JS library in the world.">
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">

<!-- Twitter -->
<meta name="twitter:site" content="@getbootstrap">
<meta name="twitter:creator" content="@getbootstrap">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="Introduction">
<meta name="twitter:description" content="文本处理 Bootstrap to get the compiled CSS and JavaScript, source code, or include it with your favorite package managers like npm, RubyGems, and more.">
<meta name="twitter:image" content="../assets/brand/bootstrap-social.png">

<!-- Facebook -->
<meta property="og:url" content="https://getbootstrap.com/docs/4.0/getting-started/introduction/">
<meta property="og:title" content="Introduction">
<meta property="og:description" content="文本处理 Bootstrap to get the compiled CSS and JavaScript, source code, or include it with your favorite package managers like npm, RubyGems, and more.">
<meta property="og:type" content="website">
<meta property="og:image" content="../assets/brand/bootstrap-social.png">
<meta property="og:image:secure_url" content="../assets/brand/bootstrap-social.png">
<meta property="og:image:type" content="image/png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
</head>
<body>
<a id="skippy" class="sr-only sr-only-focusable" href="#content">
<div class="container"> <span class="skiplink-text">跳到主体内容</span> </div>
</a>
<header class="navbar navbar-expand navbar-dark flex-column flex-md-row bd-navbar"> <a class="navbar-brand mr-0 mr-md-2" href="../index.html" aria-label="Bootstrap">
  <svg class="d-block" width="36" height="36" viewbox="0 0 612 612" xmlns="http://www.w3.org/2000/svg" focusable="false">
    <title>Bootstrap</title>
    <path fill="currentColor" d="M510 8a94.3 94.3 0 0 1 94 94v408a94.3 94.3 0 0 1-94 94H102a94.3 94.3 0 0 1-94-94V102a94.3 94.3 0 0 1 94-94h408m0-8H102C45.9 0 0 45.9 0 102v408c0 56.1 45.9 102 102 102h408c56.1 0 102-45.9 102-102V102C612 45.9 566.1 0 510 0z"/>
    <path fill="currentColor" d="M196.77 471.5V154.43h124.15c54.27 0 91 31.64 91 79.1 0 33-24.17 63.72-54.71 69.21v1.76c43.07 5.49 70.75 35.82 70.75 78 0 55.81-40 89-107.45 89zm39.55-180.4h63.28c46.8 0 72.29-18.68 72.29-53 0-31.42-21.53-48.78-60-48.78h-75.57zm78.22 145.46c47.68 0 72.73-19.34 72.73-56s-25.93-55.37-76.46-55.37h-74.49v111.4z"/>
  </svg>
  </a>
  <div class="navbar-nav-scroll">
    <ul class="navbar-nav bd-navbar-nav flex-row">
      <li class="nav-item"><a class="nav-link " href="../index.html">首页</a></li>
      <li class="nav-item"><a class="nav-link active" href="../docs/index.html">中文手册</a></li>
      <li class="nav-item"><a class="nav-link " href="../examples/index.html">实例</a></li>
      
      
      
      
    </ul>
  </div>
  
  <a class="btn btn-bd-yellow d-none d-lg-inline-block mb-3 mb-md-0 ml-md-3" href="../utilities/download.html">下载 Bootstrap</a> </header>

<div class="container-fluid">
  <div class="row flex-xl-nowrap">
    <div class="col-12 col-md-3 col-xl-2 bd-sidebar">
      


<nav class="collapse bd-links" id="bd-docs-nav">
  <div class="bd-toc-item"> <a class="bd-toc-link" href="../docs/index.html"> 快速入门 </a>
    <ul class="nav bd-sidenav">
    <li><a href="../docs/index.html">关于</a></li>
    <li><a href="../docs/download.html">下载</a></li>
    <li><a href="../docs/contents.html">目录结构</a></li>
    <li><a href="../docs/browsers-devices.html">浏览器与设备调优</a></li>
    <li><a href="../docs/javascript.html">JavaScript脚本</a></li>
    <li><a href="../docs/theming.html">主题化</a></li>
    <li><a href="../docs/build-tools.html">编译工具</a></li>
    <li><a href="../docs/webpack.html"> Webpack模块化</a></li>
    <li><a href="../docs/accessibility.html">无障碍浏览</a></li>
    </ul>
  </div>
  <div class="bd-toc-item"> <a class="bd-toc-link" href="../layout/overview.html"> 布局 </a>
    <ul class="nav bd-sidenav">
    <li><a href="../layout/overview.html">概述</a></li>
    <li><a href="../layout/grid.html">栅格</a></li>
    <li><a href="../layout/utilities-for-layout.html"> 布局实施建议 </a> </li>
    </ul>
  </div>
<div class="bd-toc-item"> <a class="bd-toc-link" href="../content/reboot.html">内容 </a>
  <ul class="nav bd-sidenav">
    <li><a href="../content/reboot.html"> 初始化与CSS重置 </a> </li>
    <li><a href="../content/typography.html"> 排版 </a> </li>
    <li><a href="../content/code.html"> 代码 </a> </li>
    <li><a href="../content/images.html"> 图片 </a> </li>
    <li><a href="../content/tables.html"> 表格 </a> </li>
    <li><a href="../content/figures.html"> 图文框 </a> </li>
  </ul>
</div>
<div class="bd-toc-item"> <a class="bd-toc-link" href="../components/alerts.html"> 组件 </a>
  <ul class="nav bd-sidenav">
      <li><a href="../components/alerts.html"> 警告提示框(Alerts) </a> </li>
    <li><a href="../components/badge.html"> 徽章(Badge) </a> </li>
    <li><a href="../components/breadcrumb.html"> 面包屑导航(Breadcrumb) </a> </li>
    <li><a href="../components/buttons.html"> 按钮(Button) </a> </li>
    <li><a href="../components/button-group.html"> 按钮组(Button-group) </a> </li>
    <li><a href="../components/card.html"> 卡片(Card) </a> </li>
    <li><a href="../components/carousel.html">  轮播效果(Carousell) </a> </li>
    <li><a href="../components/collapse.html"> 折叠面板(Collapse) </a> </li>
    <li><a href="../components/dropdowns.html"> 下拉菜单(Dropdown) </a> </li>
    <li><a href="../components/forms.html"> 表单(Form) </a> </li>
    <li><a href="../components/input-group.html"> 输入框(Input-group) </a> </li>
    <li><a href="../components/jumbotron.html"> Hero大块屏(Jumbotron) </a> </li>
    <li><a href="../components/list-group.html"> 列表组(List-group) </a> </li>
    <li><a href="../components/media-object.html"> 媒体对象/图文混排(Media-object) </a> </li>
    <li><a href="../components/modal.html"> 弹出模态框(Modal) </a> </li>
    <li><a href="../components/navs.html"> 导航/滑动门(Nav) </a> </li>
    <li><a href="../components/navbar.html"> 导航栏(Navbar) </a> </li>
    <li><a href="../components/pagination.html"> 分页(Pagination) </a> </li>
    <li><a href="../components/popovers.html"> POP提示(Popover) </a> </li>
    <li><a href="../components/progress.html"> 进度条(Progress) </a> </li>
    <li><a href="../components/scrollspy.html"> 滚动监听(Scrollspy) </a> </li>
    <li><a href="../components/spinners.html"> 旋转特效(Spinners) </a> </li>
    <li><a href="../components/toasts.html"> 弹出提示框(Toasts) </a> </li>
    <li><a href="../components/tooltips.html"> 提示冒泡(Tooltip) </a> </li>
  </ul>
</div>
<div class="bd-toc-item active"> <a class="bd-toc-link" href="borders.html"> 公共样式 </a>
  <ul class="nav bd-sidenav">
    <li><a href="borders.html"> 边框(border) </a> </li>
    <li><a href="clearfix.html"> 清动浮动(clearfix) </a> </li>
    <li><a href="close-icon.html"> 关闭图标(close icon) </a> </li>
    <li><a href="colors.html"> 颜色(color) </a> </li>
    <li><a href="display.html"> Display显示属性 </a> </li>
    <li><a href="embed.html"> 嵌入(embed) </a> </li>
    <li><a href="flex.html"> Flex弹性布局 </a></li>
    <li><a href="float.html"> Float浮动属性 </a> </li>
    <li><a href="image-replacement.html"> 图像替换 </a> </li>
	<li><a href="overflow.html"> 溢出 </a> </li>
    <li><a href="position.html"> Position固顶(底)及定位 </a> </li>
    <li><a href="screenreaders.html"> 读屏器 (Screenreaders) </a> </li>
	<li><a href="shadows.html"> 阴影(shadows) </a> </li>
    <li><a href="sizing.html"> 规格(sizi) </a> </li>
    <li><a href="spacing.html"> 间隔(spacing) </a> </li>
    <li class="active bd-sidenav-active"><a href="text.html"> 文本处理 </a> </li>
    <li><a href="vertical-align.html"> 垂直对齐(vertical align) </a> </li>
    <li><a href="visibility.html"> Visibility显示或隐藏(能见度)处理 </a> </li>
  </ul>
</div>
<div class="bd-toc-item"> <a class="bd-toc-link" href="../extend/icons.html"> 延伸(图标引用) </a>
  <ul class="nav bd-sidenav">
    <li><a href="../extend/icons.html"> 图标 </a> </li>
  </ul>
</div>
<div class="bd-toc-item"> <a class="bd-toc-link" href="../migration/index.html"> 迁移 </a>
  <ul class="nav bd-sidenav">
  </ul>
</div>
<div class="bd-toc-item"> <a class="bd-toc-link" href="../about/history.html"> 关于 </a>
  <ul class="nav bd-sidenav">
    <li><a href="../about/history.html"> History </a> </li>
    <li><a href="../about/team.html"> Team </a> </li>
    <li><a href="../about/brand.html"> Brand </a> </li>
    <li><a href="../about/license.html"> License </a> </li>
    <li><a href="../about/translations.html"> Translations </a> </li>
  </ul>
</div>
</nav>
</div>


<div class="d-none d-xl-block col-xl-2 bd-toc">
  <ul class="section-nav">
    <li class="toc-entry toc-h2"><a href="#text-alignment">文本对齐</a></li>
    <li class="toc-entry toc-h2"><a href="#text-wrapping-and-overflow">文本包裹和溢出（换行）处理</a></li>
	<li class="toc-entry toc-h2"><a href="#word-break">换行</a></li>
    <li class="toc-entry toc-h2"><a href="#text-transform">字母大小写转换</a></li>
    <li class="toc-entry toc-h2"><a href="#font-weight-and-italics">字体粗细和斜体效果</a></li>
	<li class="toc-entry toc-h2"><a href="#monospace">等宽字体</a></li>
	<li class="toc-entry toc-h2"><a href="#reset-color">重置颜色</a></li>
	<li class="toc-entry toc-h2"><a href="#text-decoration">文字装饰</a></li>
  </ul>
</div>
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
  <h1 class="bd-title" id="content">文本处理</h1>
  <p class="bd-lead">用于控制文本的对齐、组合、字重等示例以及使用文档。</p>
   
  <h2 id="text-alignment">文本对齐</h2>
  <p>使用文本对齐class样式类轻松地将文本重新对齐到组件。</p>
  <div class="bd-example">
    <p class="text-justify">Ambitioni dedisse scripsisse iudicaretur. Cras mattis iudicium purus sit amet fermentum. Donec sed odio operae, eu vulputate felis rhoncus. Praeterea iter est quasdam res quas ex communi. At nos hinc posthac, sitientis piros Afros. Petierunt uti sibi concilium totius Galliae in diem certam indicere. Cras mattis iudicium purus sit amet fermentum.</p>
  </div>
  <div class="highlight">
    <pre><code class="language-html" data-lang="html"><span class="nt">&lt;p</span> <span class="na">class=</span><span class="s">"text-justify"</span><span class="nt">&gt;</span>Ambitioni dedisse scripsisse iudicaretur. Cras mattis iudicium purus sit amet fermentum. Donec sed odio operae, eu vulputate felis rhoncus. Praeterea iter est quasdam res quas ex communi. At nos hinc posthac, sitientis piros Afros. Petierunt uti sibi concilium totius Galliae in diem certam indicere. Cras mattis iudicium purus sit amet fermentum.<span class="nt">&lt;/p&gt;</span></code></pre>
  </div>
  <p>左对齐、右对齐、居中对齐，可以使用与栅格系统相同的宽度响应式类（即<code class="highlighter-rouge">text-sm-*</code>、<code class="highlighter-rouge">text-lg-*</code>等方法）来定义。</p>
  <div class="bd-example">
    <p class="text-left">Left aligned text on all viewport sizes.</p>
    <p class="text-center">Center aligned text on all viewport sizes.</p>
    <p class="text-right">Right aligned text on all viewport sizes.</p>
    <p class="text-sm-left">Left aligned text on viewports sized SM (small) or wider.</p>
    <p class="text-md-left">Left aligned text on viewports sized MD (medium) or wider.</p>
    <p class="text-lg-left">Left aligned text on viewports sized LG (large) or wider.</p>
    <p class="text-xl-left">Left aligned text on viewports sized XL (extra-large) or wider.</p>
  </div>
  <div class="highlight">
    <pre><code class="language-html" data-lang="html"><span class="nt">&lt;p</span> <span class="na">class=</span><span class="s">"text-left"</span><span class="nt">&gt;</span>Left aligned text on all viewport sizes.<span class="nt">&lt;/p&gt;</span>
<span class="nt">&lt;p</span> <span class="na">class=</span><span class="s">"text-center"</span><span class="nt">&gt;</span>Center aligned text on all viewport sizes.<span class="nt">&lt;/p&gt;</span>
<span class="nt">&lt;p</span> <span class="na">class=</span><span class="s">"text-right"</span><span class="nt">&gt;</span>Right aligned text on all viewport sizes.<span class="nt">&lt;/p&gt;</span>

<span class="nt">&lt;p</span> <span class="na">class=</span><span class="s">"text-sm-left"</span><span class="nt">&gt;</span>Left aligned text on viewports sized SM (small) or wider.<span class="nt">&lt;/p&gt;</span>
<span class="nt">&lt;p</span> <span class="na">class=</span><span class="s">"text-md-left"</span><span class="nt">&gt;</span>Left aligned text on viewports sized MD (medium) or wider.<span class="nt">&lt;/p&gt;</span>
<span class="nt">&lt;p</span> <span class="na">class=</span><span class="s">"text-lg-left"</span><span class="nt">&gt;</span>Left aligned text on viewports sized LG (large) or wider.<span class="nt">&lt;/p&gt;</span>
<span class="nt">&lt;p</span> <span class="na">class=</span><span class="s">"text-xl-left"</span><span class="nt">&gt;</span>Left aligned text on viewports sized XL (extra-large) or wider.<span class="nt">&lt;/p&gt;</span></code></pre>
  </div>
  <h2 id="text-wrapping-and-overflow">文本包裹和溢出（换行）处理</h2>
  <p>使用<code class="highlighter-rouge">.text-wrap</code>类换行文本.</p>
  <div class="bd-example">
<div class="badge badge-primary text-wrap" style="width: 6rem;">
  This text should wrap.
</div>
</div>
  <figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"badge badge-primary text-wrap"</span> <span class="na">style=</span><span class="s">"width: 6rem;"</span><span class="nt">&gt;</span>
  This text should wrap.
<span class="nt">&lt;/div&gt;</span></code></pre></figure>
  
  <p><code class="highlighter-rouge">.text-nowrap</code> class样式类可以防止文本换行.</p>
  <div class="bd-example">
<div class="text-nowrap bd-highlight" style="width: 8rem;">
  This text should overflow the parent.
</div>
</div>
  <div class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"text-nowrap"</span> <span class="na">style=</span><span class="s">"width: 8rem;"</span><span class="nt">&gt;</span>
  This text should overflow the parent.
<span class="nt">&lt;/div&gt;</span></code></pre></div>
  <p>对于更长的内容，你可以添加一个 <code class="highlighter-rouge">.text-truncate</code> class样式，以省略号截断文本（<strong>需要结合  <code class="highlighter-rouge">display: inline-block</code> 或 <code class="highlighter-rouge">display: block</code>来使用）。</strong></p>
  <div class="bd-example"> 
    <!-- Block level -->
    <div class="row">
      <div class="col-2 text-truncate"> Praeterea iter est quasdam res quas ex communi. </div>
    </div>
    
    <!-- Inline level --> 
    <span class="d-inline-block text-truncate" style="max-width: 150px;"> Praeterea iter est quasdam res quas ex communi. </span> </div>
  <div class="highlight">
    <pre><code class="language-html" data-lang="html"><span class="c">&lt;!-- Block level --&gt;</span>
<span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"row"</span><span class="nt">&gt;</span>
  <span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"col-2 text-truncate"</span><span class="nt">&gt;</span>
    Praeterea iter est quasdam res quas ex communi.
  <span class="nt">&lt;/div&gt;</span>
<span class="nt">&lt;/div&gt;</span>

<span class="c">&lt;!-- Inline level --&gt;</span>
<span class="nt">&lt;span</span> <span class="na">class=</span><span class="s">"d-inline-block text-truncate"</span> <span class="na">style=</span><span class="s">"max-width: 150px;"</span><span class="nt">&gt;</span>
  Praeterea iter est quasdam res quas ex communi.
<span class="nt">&lt;/span&gt;</span></code></pre>
  </div>
  <h2 id="word-break"><span class="bd-content-title">换行</span></h2>
  <p>通过使用<code class="highlighter-rouge">.text-break</code>来设置<code class="highlighter-rouge">overflow-wrap: break-word</code> (和<code class="highlighter-rouge">word-break: break-word</code> 用于IE和Edge兼容性的break-word)防止长串文本破坏组件的布局.</p>
  <div class="bd-example">
<p class="text-break">mmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmm</p>
</div>
<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt">&lt;p</span> <span class="na">class=</span><span class="s">"text-break"</span><span class="nt">&gt;</span>mmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmm<span class="nt">&lt;/p&gt;</span></code></pre></figure>
  
  
  <h2 id="text-transform">字母大小写转换</h2>
  <p>使用文本大小写样式将文字内容由小写，转为大写（不支持中文）。</p>
  <div class="bd-example">
    <p class="text-lowercase">Lowercased text.</p>
    <p class="text-uppercase">Uppercased text.</p>
    <p class="text-capitalize">CapiTaliZed text.</p>
  </div>
  <div class="highlight">
    <pre><code class="language-html" data-lang="html"><span class="nt">&lt;p</span> <span class="na">class=</span><span class="s">"text-lowercase"</span><span class="nt">&gt;</span>Lowercased text.<span class="nt">&lt;/p&gt;</span>
<span class="nt">&lt;p</span> <span class="na">class=</span><span class="s">"text-uppercase"</span><span class="nt">&gt;</span>Uppercased text.<span class="nt">&lt;/p&gt;</span>
<span class="nt">&lt;p</span> <span class="na">class=</span><span class="s">"text-capitalize"</span><span class="nt">&gt;</span>CapiTaliZed text.<span class="nt">&lt;/p&gt;</span></code></pre>
  </div>
  <p>注意： <code class="highlighter-rouge">text-capitalize</code>仅支持每一个词的第一个字母转为大写，而其它字母不受影响。</p>
  <h2 id="font-weight-and-italics">字体粗细和斜体效果</h2>
  <p>快速的实体字体粗细定义、斜体。</p>
  <div class="bd-example">
    <p class="font-weight-bold">Bold text.</p>
    <p class="font-weight-normal">Normal weight text.</p>
    <p class="font-weight-light">Light weight text.</p>
    <p class="font-italic">Italic text.</p>

  </div>
  <div class="highlight">
    <pre><code class="language-html" data-lang="html"><span class="nt">&lt;p</span> <span class="na">class=</span><span class="s">"font-weight-bold"</span><span class="nt">&gt;</span>Bold text.<span class="nt">&lt;/p&gt;</span>
<span class="nt">&lt;p</span> <span class="na">class=</span><span class="s">"font-weight-normal"</span><span class="nt">&gt;</span>Normal weight text.<span class="nt">&lt;/p&gt;</span>
<span class="nt">&lt;p</span> <span class="na">class=</span><span class="s">"font-weight-light"</span><span class="nt">&gt;</span>Light weight text.<span class="nt">&lt;/p&gt;</span>
<span class="nt">&lt;p</span> <span class="na">class=</span><span class="s">"font-italic"</span><span class="nt">&gt;</span>Italic text.<span class="nt">&lt;/p&gt;</span></code></pre>
  </div>
  
  <h2 id="monospace">等宽字体</h2>
<p>将选择更改为我们的等宽字体堆栈<code>.text-monospace</code>。</p>
<div class="bd-example">
<p class="text-monospace">这是等宽</p>
</div>
<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt">&lt;p</span> <span class="na">class=</span><span class="s">"text-monospace"</span><span class="nt">&gt;</span>This is in monospace<span class="nt">&lt;/p&gt;</span></code></pre></figure>
<h2 id="reset-color"><span class="bd-content-title">重置颜色</span></h2>
<p>使用<code class="highlighter-rouge">.text-reset</code>重置文本或链接的颜色,以便从其父级继承颜色.</p>
<div class="bd-example">
<p class="text-muted">
  Muted text with a <a href="#" class="text-reset">reset link</a>.
</p>
</div>
<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt">&lt;p</span> <span class="na">class=</span><span class="s">"text-muted"</span><span class="nt">&gt;</span>
  Muted text with a <span class="nt">&lt;a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"text-reset"</span><span class="nt">&gt;</span>reset link<span class="nt">&lt;/a&gt;</span>.
<span class="nt">&lt;/p&gt;</span></code></pre></figure>
<h2 id="text-decoration"><span class="bd-content-title">文字装饰</span></h2>
<p>使用<code class="highlighter-rouge">.text-decoration-none</code>类删除文本修饰.</p>
<div class="bd-example">
<a href="#" class="text-decoration-none">Non-underlined link</a>
</div>

<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt">&lt;a</span> <span class="na">href=</span><span class="s">"#"</span> <span class="na">class=</span><span class="s">"text-decoration-none"</span><span class="nt">&gt;</span>Non-underlined link<span class="nt">&lt;/a&gt;</span></code></pre></figure>
</main>
</div>
</div>


<script src="../js/jquery-3.2.1.slim.min.js"></script> 
<script>window.jQuery || document.write('<script src="../assets/js/vendor/jquery-slim.min.js"><\/script>')</script> 
<script src="../dist/js/popper.min.js"></script> 
<script src="../dist/js/bootstrap.min.js"></script> 
<script src="../assets/js/docs.min.js"></script> 
<script src="../assets/js/ie-emulation-modes-warning.js"></script> 
<script src="../assets/js/docsearch.min.js"></script> 
 

</body>
</html>
